<template>
	<!-- 修改密码 -->
	<view class="content">
		<uni-nav-bar title="修改密码" fixed statusBar :border="false" height="88rpx" background-color="#fff" left-icon="left"
			@clickLeft="onClickLeft"></uni-nav-bar>

		<view class="main">
			<uni-forms ref="customForm" :rules="customRules" :model="customFormData" :label-width="100">
				<view class="row">
					<view class="col">
						<uni-forms-item label="原密码:" required name="oldPassword">
							<uni-easyinput type="password" v-model="customFormData.oldPassword" placeholder="请输入原密码" style="width: 100%;" adjust-position />
						</uni-forms-item>
					</view>
				</view>
				<view class="row">
					<view class="col">
						<uni-forms-item label="新密码:" required name="newPassword">
							<uni-easyinput type="password" v-model="customFormData.newPassword" placeholder="请输入新密码" style="width: 100%;" adjust-position />
						</uni-forms-item>
					</view>
				</view>
				<view class="row">
					<view class="col">
						<uni-forms-item label="确认密码:" required name="ackPassword">
							<uni-easyinput type="password" v-model="customFormData.ackPassword" placeholder="请再次输入新密码" style="width: 100%;" adjust-position />
						</uni-forms-item>
					</view>
				</view>
			</uni-forms>
		</view>
		<view class="bottomFix btn type-1" :style="{paddingBottom:safeAreaBottom + 'px'}" @click.stop="submitForm">
			<text>确认修改</text>
		</view>
	</view>
</template>

<script>
	import { reqUpdatePassword } from '@/apis/member'
	export default {
		name: "AutotrophyGoods",
		data() {
			return {
				customFormData: {
					oldPassword: '',
					newPassword: '',
					ackPassword: ''
				},
				customRules: {
					oldPassword: {
						rules: [{
								required: true,
								errorMessage: '请输入原密码',
							},
							{
								minLength: 6,
								maxLength: 16,
								errorMessage: '密码长度在6-16位之间',
							},
						],
					},
					newPassword: {
						rules: [{
								required: true,
								errorMessage: '请输入新密码',
							},
							{
								minLength: 6,
								maxLength: 16,
								errorMessage: '密码长度在6-16位之间',
							},
						],
					},
					ackPassword: {
						rules: [{
								required: true,
								errorMessage: '请再次输入新密码',
							},
							{
								minLength: 6,
								maxLength: 16,
								errorMessage: '密码长度在6-16位之间',
							},
						],
					},
				},
			}
		},
		onLoad(params) {},
		methods: {
			submitForm() {
				this.$refs.customForm.validate(async (res) => {
					console.log('res', res);
					// return 
					if (!res) {
						let data = {
							...this.customFormData
						}
						const res = await reqUpdatePassword(data)
						if (res.code == 200) {
							uni.showToast({
								title: '修改成功',
								icon: 'none',
								duration: 1000
							})
							setTimeout(() => {
								uni.navigateBack()
							}, 1000)

						}
					}
				})
			}
		}
	}
</script>
<style>
	page {
		background: #f7f7f7;
	}
</style>
<style lang="scss" scoped>
	view {
		box-sizing: border-box;
	}
	.content {
		position: relative;
		height: 100vh;
	}
	.main {
		padding: 20rpx;
		// height: calc(100% - 88rpx);
		// overflow: scroll;
	}

	.row {
		display: flex;
		// align-items: center;
		height: 80rpx;
		line-height: 80rpx;
		margin-bottom: 60rpx;

		.col {
			width: 90%;
		}

		.col2 {
			width: 70%;
			margin-right: 20rpx;
		}
	}

	.btnBox {
		width: 100%;
		text-align: center;
	}
	.bottomFix {
		position: absolute;
		box-sizing: content-box;
		width: 100%;
		height: 80rpx;
		bottom: 0;
		left: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: $uni-font-size-base;
	}
</style>